<template>
	<view>
		<form action="">
			<view class="inp">
				收货人：<input type="text" placeholder="请输入收货人" v-model="userInfo.username">
			</view>
			<view class="inp">
				手机号：<input type="text" placeholder="请输入手机号" v-model="userInfo.userphone">
			</view>
			<view class="inp">
				所在地址：<input type="text" placeholder="请输入所在地址" v-model="userInfo.location">
			</view>
			<view class="inp">
				详细地址：<input type="text" placeholder="请输入详细地址" v-model="userInfo.useraddress">
			</view>
		</form>
		<view class="btn">
			<button @click="submit">保存并使用</button>
			<button @click="resset">重置</button>
		</view>
	</view>
</template>

<script>
	import {
		addressadd,
		addresslist,
		addressedit
	} from '../../request/app.js'
	export default {
		data() {
			return {
				userInfo: {
					username: '',
					userphone: '',
					location: "",
					useraddress: '',
				},
				isAdd: true,
				id: ""
			}
		},
		onLoad(options) {
			//判断是否为地址编辑
			if (options) {
				//获取地址列表
				addresslist({
					uid: uni.getStorageSync("userInfo").uid,
					id: options.id
				}).then(res => {
					console.log(res);
					//获取到数据进行回现
					this.userInfo.username = res.data.list[0].username
					this.userInfo.userphone = res.data.list[0].userphone
					this.userInfo.location = res.data.list[0].location
					this.userInfo.useraddress = res.data.list[0].useraddress
					this.isAdd = false
					this.id = options.id
				})
			}
		},
		methods: {
			//添加地址
			submit() {
				if (!this.userInfo.username || !this.userInfo.userphone || !this.userInfo.location || !this
					.userInfo.useraddress) {
					uni.showToast({
						title: '请输入必要参数',
						icon: 'error'
					})
					return
				}
				//判断是添加还是编辑
				if (this.isAdd) {
					//调用添加接口
					addressadd({
							...this.userInfo,
							uid: uni.getStorageSync('userInfo').uid
						})
						.then(res => {
							console.log(res, '添加地址');
							if (res.data.code != 200) {
								uni.showToast({
									title: res.data.msg,
									icon: 'none'
								})
							} else {
								//跳转回列表页面
								uni.navigateTo({
									url: '../address/address'
								})
							}
						})
				} else {
					//调用地址编辑接口
					addressedit({
						...this.userInfo,
						id: this.id
					}).then(res => {
						console.log(res, '编辑地址');
						if (res.data.code != 200) {
							uni.showToast({
								title: res.data.msg,
								icon: 'none'
							})
						} else {
							//跳转回列表页面
							uni.navigateTo({
								url: '../address/address'
							})
						}
					})
				}
			},
			//重置
			resset() {
				this.userInfo.username = ""
				this.userInfo.userphone = ""
				this.userInfo.location = ""
				this.userInfo.useraddress = ""
			}
		}
	}
</script>

<style>
	.set {
		margin-top: 20rpx;
		display: flex;
		align-items: center;
		justify-content: space-around;
	}

	.btn {
		margin-top: 60rpx;
	}

	button {
		margin-bottom: 20rpx;
	}

	button:nth-child(1) {
		background-color: #FF6040;
		color: #fff;
		font-weight: bold;
		width: 90%;
	}

	button:nth-child(2) {
		font-weight: bold;
		width: 90%;
	}

	.inp {
		width: 100%;
		display: flex;
		padding: 40rpx;
		font-size: 40rpx;
	}

	.inp>input {
		font-size: 40rpx;
		width: 70%;
		border-bottom: 2rpx solid black;
	}
</style>
